<extend name="Public/base"/>
<block name="head">
	<link href="__CSS__/topic.css" rel="stylesheet">
</block>
<block name="body">
<div class="container" >
    <div class="row">
        <div class="col-md-8 article-left">
            <volist name="_list" id="data">
                    <div class="topic-box clear">
                        <a href="{:U('topic/detail',array('id'=>$data['id']))}">
	                        <div class="col-md-5 img">
	                        	<img alt="{$data.topic_name}" src="{$data.pic_url|get_image_url}">
	                        </div>
	                        <div class="col-md-7 ">
	                        	 <h3 class="text-danger">
		                        	{$data.topic_name}
		                        </h3>
                            	<p class="discription">{$data['discription']}</p>
	                        </div>
	                       
                        </a>                
                    </div>
             </volist>
        </div>
        <div class="col-md-4 article-right">
            <div class="tc-box first-box">
                <div class="headtitle">
                    <h2>热门文章</h2>
                </div>
                <div class="news-label col-md-12">
					<ul class="col-md-12 new-list">
					<volist name="recommend_article" id="data">
						<if condition="$data.position eq 4">
							<li class="list-unstyled">
								<i class="circle <if condition='$i lt 4'> circle-active</if>">{$i}</i>
								<a href="{:U('Article/detail?id='.$data['id'])}">{$data.title}</a>
							</li>
						</if>
						
					</volist>
					
				</ul>
				</div>
            </div>
        </div>
    </div>
    <notempty name="_page">
    	 <div class="row">
	        	<div class="col-md-12">
	        		<nav>
					  <ul class="pagination">
					    {$_page}
					  </ul>
					</nav>
	            
	            </div>
	      </div>
</notempty>
</div>

</block>
<block name="script">
	$(function(){
		$('.topic-box').hover(
			function(){
				$(this).css('border-top','2px solid #E4A22D');
			},function(){
				$(this).css('border-top','1px solid #ccc');
			}
		);
	});
</block>

